<template>
  <div style="height: 1600px">
    <el-dialog title="企业列表" :visible.sync="isShow" width="1200px">
      <el-table :data="tableList2" height="650">
        <el-table-column
          label="公司名称"
          align="center"
          prop="d2CorpName"
          width="250"
          tooltip-effect
        />
        <el-table-column prop="creditRate" label="评分" width="100" align="center">
          <template slot-scope="scope">
            <div class="">
             {{scope.row.creditRate ||'-' }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="label" label="标签" width="400" align="center">
          <template slot-scope="scope">
            <div class="label_box">
              <div v-for="(item, index) in scope.row.labelList" :key="index" >
                <div :style="{ background: item.backgroundColor,color:item.fontColor}" class="label_div">
                  {{ item.name }}
                </div>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="d2LegalPer" label="法定代表人" width="100" align="center">
          <template slot-scope="scope">
            <div class="">
             {{scope.row.d2LegalPer ||'-' }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="注册资本" align="center" prop="d2Regcap" />
        <!-- <el-table-column label="成立日期" align="center" prop="d2Esdate" /> -->
        <el-table-column prop="d2Esdate" label="成立日期" width="100" align="center">
          <template slot-scope="scope">
            <div class="">
             {{scope.row.d2Esdate ||'-' }}
            </div>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </el-dialog>
  </div>
</template>
<script>
import request from "@/utils/request";

export default {
  name: "" /*1. Vue扩展 */,
  extends: "", // extends和mixins都扩展逻辑，需要重点放前面
  mixins: [],
  components: {} /* 2. Vue数据 */,
  props: {},
  model: { prop: "", event: "" }, // model 会使用到 props
  data() {
    return {
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        dictName: undefined,
        dictType: undefined,
        status: undefined,
      },
      isShow: false,
      // 总条数
      total: 4,
      tableList2: [
        {
          d2CorpName: "苏州智能交通信息科技股份有限公司",
          creditRate: "597",
          label: ["在业", "城市交通", "高新技术", "近三年涉嫌"],
          legal: "芮建秋",
          registered: "4000万元",
          establishment: "2004-11-15",
        },
        {
          d2CorpName: "苏州奥智智能设备股份有限公司",
          creditRate: "638",
          label: ["瞪羚", "专利", "自动控制系统装置制造", "近三年涉嫌"],

          legal: "闫瑞",
          registered: "3070万元",
          establishment: "2008-05-05",
        },
        {
          d2CorpName: "江苏保丽洁环境科技股份有限公司",
          creditRate: "679",
          label: ["在业", "城市交通", "专业技术服务业", "高新技术"],
          legal: "吴琴秀",
          registered: "400万元",
          establishment: "2004-11-15",
        },
        {
          d2CorpName: "苏州金远胜智能装备股份有限公司",
          creditRate: "656",
          label: ["在业", "专利", "通用设备制造业", "高新技术"],
          legal: "朱化星",
          registered: "400万元",
          establishment: "2004-11-15",
        },
      ],
    };
  },
  computed: {},
  watch: {} /* 3. Vue资源 */, // watch 监控的是 props 和 data，有必要时监控computed
  filters: {},
  directives: {} /* 4. Vue生命周期 */,
  created() {},
  mounted() {},
  destroy() {} /* 5. Vue方法 */,
  methods: {
    // 查询部门列表
    getList(row) {
      this.loading = false;
      this.queryParams.fileName = row.fileName;
      this.loading = false;
      request({
        url: "/visitcorp/CORP/queryVisitCorpFileGroupByFileName",
        method: "get",
        params: this.queryParams,
      }).then((res) => {
        console.log(res, "弹窗参数");
        this.tableList2 = res.rows;
        this.total = res.rows.total;
      });
    },
    check(row) {
      console.log("11");
      this.getList(row);
    },
  }, // all the methods should be put here in the last
};
</script>
<style scoped>
.box {
  height: 800px;
}
.label_box {
  display: flex;
  flex-wrap: wrap;
}
.label1 {
  background: #e3f2ed;
  color: #3f9f71;
  text-align: center;
  padding: 0 10px;
  margin-right: 5px;
}
.label2 {
  background: #e4efff;
  color: #3282e4;
  text-align: center;
  padding: 0 10px;
  margin-right: 5px;
}
.label3 {
  background: #fbf1db;
  color: #aa7c1b;
  text-align: center;
  padding: 0 10px;
  margin-right: 5px;
}
.label4 {
  background: #f6e6e1;
  color: #c33d28;
  text-align: center;
  padding: 0 10px;
  margin-right: 5px;
}
/deep/.el-dialog {
  height: 800px;
}
.label_div{
  margin-left: 10px;
  margin-top: 10px;
  padding: 0 15px;
}
</style>
